<template>
	<view class="container">
    <view class="scan-code" @tap="onScanCode">
      <view class="scan-icon">
        <image src="../../static/images/scan.png" mode="widthFix" />
      </view>
      <view class="scan-t">扫码学校二维码</view>
    </view>
	</view>
</template>

<script setup>
const onScanCode = () => {
        uni.scanCode({
          success: function (res) {
            uni.showToast({
                title: '扫描成功',
                icon: 'success'
            });
            // 处理扫描结果
            const result = res.result
            console.log('result:', result)
            const schoolId = result?.split('m/')[1]
            uni.navigateTo({
              url: `/pages/order/order?schoolId=${schoolId}`
            })
          },
          fail: function (err) {
            console.error('扫描失败: ', err);
            uni.showToast({
                title: '扫描失败',
                icon: 'none'
            });
          }
        })
      }
</script>

<style lang="scss" scoped>
.container{
  padding: 30rpx;
  width: 100%;
  height: 100vh;
  box-sizing: border-box;
  .scan-code{
    padding: 150rpx 0;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    box-shadow: 2px 1px 30px 2px rgba(0, 0, 0, 0.1);
    .scan-icon{
      width: 200rpx;
      height: 200rpx;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #5a90ff;
      border-radius: 50%;
      image{
        width: 80rpx;
        height: 80rpx;
        display: block;
      }
    }
  }
  .scan-t{
    margin-top: 16rpx;
    width: 100%;
    color: #333;
    font-size: 32rpx;
    text-align: center;
  }
}
</style>
